<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<!-- 外部样式，是推荐的方式 -->
		<link rel="stylesheet" type="text/css" href="css/my.css"/>
		
		<!-- 内部样式，也不建议这样写，一般学习测试时候为了方便可以这么写
		 这样写将html和css分离，但是还是没有实现完全的分离-->
		<style>
			/* Ctrl+Shift+/ */
			/* 就类似于java里面把一个功能封装成一个方法，
			在css里面就是把多个样式放在一起，使用只要加class="color-blue" */
			.color-blue{
				color: blue;
				text-decoration: underline;
				background-color: #FFFF00;
			}
		</style>
	</head>
	<body>
		<!-- 内联样式，不建议使用 -->
		<h1 style="color: red;">王老师</h1>
		<h1 class="color-blue">朱老师</h1>
		<h1 class="color-pink">高老师</h1>
	</body>
</html>